<template>
  <div class="record">
    <view class="search">
      <input @confirm="confirm" confirm-type="search" placeholder="请输入搜索关键词" type="text" v-model="value">
      <button @click="add"><u-icon name="plus"></u-icon></button>
    </view>
    <view class="sec_record">
      <view v-for="(val,index) in items" :key="index" class="card">
        <uni-card :title="val.account" thumbnail="../../../../static/cat.jpeg" :extra="val.createTime">
          <p>血压/高压：{{val.upper}}</p>
          <p>血压/低压：{{val.lower}}</p>
          <p>脉搏（每分/次）：{{val.pulse}}</p>
          <p>备注：{{val.description}}</p>
        </uni-card>
      </view>
    </view>
    
  </div>
</template>
<script>
export default {
  data() {
    return {
      items:[],
      value:''
    }
  },
  onShow() {
    this.initFn()
  },
  methods: {
    confirm(event){
      console.log(event);
      this.initFn(event.detail.value)
    },
    add(){
      uni.navigateTo({
         url: './addRecord'
      });
    },
    initFn(val){
      let token = this.$store.state.token
      let searchUrl = 'http://39.106.224.223:8088/ac/record/query'
      if (val) {
        searchUrl = 'http://39.106.224.223:8088/ac/record/query?Authorization='+val
      }
      uni.request({
        url: searchUrl,
        header:{
          'content-type':'application/json',
          'Authorization':token
        },
        method:'GET',
        success:res=>{
          if (res.data.code == 200) {
            this.items = res.data.data
          }
        }
      })
    }
  },
}
</script>
<style lang="scss">
  .record{
    width: 100%;
    height: 100%;
    .search{
    width: 100%;
    padding: 10rpx;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #f3f3f3;
    input{
      flex: 1;
      border: 1px solid #cccccc;
      padding: 10rpx;
      border-radius: 6rpx;
    }
    button{
      width: 70rpx;
      height: 70rpx;
      display: flex;
      justify-content: center;
      align-items: center;
      margin-left: 15rpx;
      background: #11998e;
      color: #fff;
    }
  }
  .sec_record{
    flex: 1;
    overflow-y: auto;
    .card{
      p{
        padding: 10rpx 0;
      }
    }
  }
}
</style>